/**
 * Created by xmgong on 2017/10/24.
 * 我的账号
 */
import React from 'react';
import {connect} from 'react-redux';
import {
    Text,
    ScrollView,
    View,
    StyleSheet,
    Image,
    Alert,
    Button,
    InteractionManager,
    NativeModules,
    TouchableHighlight
} from 'react-native';
import styles from './styles';
import {getBankAccountDetailAction} from './actions';
import AccountEdit from './AccountEdit';
import Naviutils from '../../utils/NaviUtil';
import CLNavigatorHeader from '../../component/CLNavigatorHeader';
import {naviPush} from '../../navigatorApp/actions';
import { gotoCert } from '../main/actions';

class MyAccount extends React.Component {

    static navigationOptions = ({navigation, screenProps}) => ({
        header: <CLNavigatorHeader navigation={navigation} title="我的账号"/>,
    });

    constructor(props) {
        super(props);
        this.carduri = require('../../image/img_bank_white.png');
    }


    toAuth = () => {
        this.props.gotoCert(true);
        this.props.naviPush("shopAuth", {});
    };

    editAccountClick = () => {

        let authResult = undefined;
        if (this.props.auditStatus == -1 || this.props.auditStatus == -2) {
            authResult = '您还未通过实名认证';
            Alert.alert('温馨提醒', authResult, [
                {text: '取消', onPress: () => console.log('cancel')},
                {text: '去认证', onPress: () => this.toAuth()}
            ]);
            return;
        } else if (this.props.auditStatus == 0) {
            authResult = '认证中，请耐心等待!';
            Alert.alert('温馨提醒', authResult, [
                {text: '取消', onPress: () => console.log('cancel')}
            ]);
            return;
        }

        let params = {};
        if (this.props.bankId == '') {
            params.flag = 'add';
        } else {
            params.flag = 'edit';
        }
        this.props.naviPush("accountedit", params)
    };


    componentDidMount() {
        this.props.getBankInfo(this.props.token);
    }

    render() {


        let cardname = "";
        if (this.props.bankName.length > 0) {
            cardname = this.props.bankName;
        } else {
            cardname = "点击添加账号";
        }

        return (
            <ScrollView style={{flex: 1, backgroundColor: '#ebebeb'}}>
                <TouchableHighlight
                    onPress={this.editAccountClick}
                    underlayColor='rgba(255,255,255,0)'>
                    <View style={styles.cardbg}>
                        <Image source={this.carduri} style={styles.cardimg}/>
                        <View style={styles.cardinfo}>
                            <Text style={styles.cardinfotxt}>{this.props.bankId}</Text>
                            <Text style={styles.cardinfotxt}>{cardname}</Text>
                        </View>
                        <Image source={require('../../image/img_right_white.png')}
                               style={{width: 20, height: 20}}/>
                    </View>
                </TouchableHighlight>
            </ScrollView>);
    }
}

const mapStateToProps = state => ({
    token: state.mainmodel.token,
    bankId: state.income.bankId,
    bankName: state.income.bankName,
    auditStatus: state.shop.auditStatus
});

const mapDispatchToProps = (dispatch) => {
    return {
        getBankInfo: (token) => {
            dispatch(getBankAccountDetailAction(token));
        },
        naviPush: (routeName, params) => {
            dispatch(naviPush(routeName, params))
        },
        gotoCert: (value) => {
            dispatch(gotoCert(value));
        }
    }
};

export default connect(
    mapStateToProps,
    mapDispatchToProps
)(MyAccount);

